<template>
  <div class="detail-wrap">
    <el-dialog v-model="dialogVisible" top="3vh" :title="title" width="800px" class="one-dialog" draggable @close="emit('close')">
      <el-form ref="ruleFormRef" :model="ruleForm" label-width="110px" class="mr-14">
        <el-form-item :label="item.label" v-for="item in obj[props.currentRow.orgName]" :key="item.label">
          <el-input v-model="ruleForm[item.value]" :type="item.type" />
        </el-form-item>
        <el-form-item label="备注">
          <el-input v-model="ruleForm.bz" type="textarea" />
        </el-form-item>
        <el-form-item label="附件">
          <el-upload class="upload-demo" action="#" multiple :limit="3">
            <el-button type="primary">上传文件</el-button>
            <template #tip>
              <div class="el-upload__tip"> 支持PDF、Word、zip、rar、7z格式，限制20M </div>
            </template>
          </el-upload>
        </el-form-item>
        <div class="upload-tip"></div>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="dialogVisible = false">取消</el-button>
          <el-button type="primary" @click="dialogVisible = false"> 确认 </el-button>
        </div>
      </template>
      <!-- <el-form-item label="申请用途">用途说明</el-form-item> -->
    </el-dialog>
  </div>
</template>
<script lang="ts" setup>
import to from 'await-to-js'
import type { FormInstance } from 'element-plus'

const handleAvatarSuccess = () => {}
const obj = {
  API: [
    {
      label: '授权账号',
      value: 'orgName'
    },
    {
      label: '授权密码',
      value: 'code'
    },
    {
      label: 'key',
      value: 'time'
    },
    {
      label: 'OAuth tokens',
      value: 'tokens'
    }
  ],
  H5: [
    {
      label: '链接地址',
      value: 'orgName'
    },
    {
      label: '账号',
      value: 'code'
    },
    {
      label: '密码',
      value: 'time'
    }
  ],
  SDK: [
    {
      label: '授权密钥',
      value: 'sdk'
    },
    {
      label: '入口地址',
      value: 'sdk'
    }
  ],
  私有化部署: [
    {
      label: '说明',
      value: 'sdk',
      type: 'textarea'
    }
  ]
}

const emit = defineEmits(['close'])
const props = defineProps<{
  currentRow: any
  type: string
}>()
const title = ref('交付处理')
console.log(obj[props.currentRow.orgName], 12123123)
const dialogVisible = ref<boolean>(true)
const ruleForm = ref({
  orgName: '',
  code: '',
  time: '',
  applyUser: '张三',
  status: 0,
  imageUrl: null,
  bz: ''
})
const tableData = ref(props.currentRow.inner)
</script>
<style lang="scss" scoped>
.detail-wrap {
}
.small-uploader {
  width: 145px;
  height: 30px;
  display: block;
  border: 1px solid var(--el-border-color);
  .el-icon.avatar-uploader-icon {
    font-size: 18px;
    color: #8c939d;
    width: 145px;
    height: 30px;
    text-align: center;
  }
}
.avatar-uploader {
  width: 145px;
  height: 105px;
  display: block;
  border: 1px dashed var(--el-border-color);
  .el-icon.avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 145px;
    height: 105px;
    text-align: center;
  }
}
</style>
